<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta name="author" content="lijinbo" />
    <title>255-好看的开关组件</title>
    <link rel="stylesheet" href="./255-style.css" />
  </head>

  <body>
    <label class="switch">
      <span class="switch__wrapper">
        <input class="switch__input" type="checkbox" role="switch" checked />
        <span class="switch__emoji">
          <span class="switch__emoji-face switch__emoji-face--sad">
            <span class="switch__emoji-eye"></span>
            <span class="switch__emoji-eye"></span>
            <span class="switch__emoji-mouth"></span>
          </span>
          <span class="switch__emoji-face">
            <span class="switch__emoji-eye"></span>
            <span class="switch__emoji-eye"></span>
            <span class="switch__emoji-mouth"></span>
          </span>
        </span>
      </span>
      <span class="switch__label">Power</span>
    </label>
  </body>
</html>
